-
Notifications
You must be signed in to change notification settings - Fork 141
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix: Storybook 上で props のドキュメントが表示されない問題を修正 #4719
Conversation
@@ -64,6 +64,9 @@ const config: StorybookConfig = { | |||
docs: { | |||
autodocs: true, | |||
}, | |||
typescript: { | |||
reactDocgen: 'react-docgen-typescript', | |||
}, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
コンポーネントファイルの静的解析を行ってるツールが、Storybook v7 までは react-docgen-typescript
だったんですが、v8 からはデフォルトが react-docgen
に代わりました。
react-docgen
の強みはパフォーマンスなんですが、機能面ではわずかに react-docgen-typescript
に負けます。
基本的には react-docgen
でことたりるんですが、どうやら smarthr-ui の Storybook の使い方だと、 react-docgen-typescript
を使わないと情報が取得できなかったみたいです。なので使用するツールを明示して復活させます。
このあたりについては、急に手前味噌記事を出しますが、以下記事で深堀りしてます。
Storybook と react-docgen の仕組みを追う
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Cntrols たぶで unknown になっていた props が表示されてることを確認しました。
ついでに自動生成される Docs に Controls を表示してもよさそうに思いました!
docs: {
page: () => (
<>
<Title />
<Subtitle />
<Description />
<Primary />
<Controls /> /* ← これを足す */
<Stories includePrimary={false} />
</>
),
},
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM!
Related URL
https://smarthr.atlassian.net/browse/SHRUI-989
Overview
Storybook v8 にマイグレーションしたタイミングから、Storybook 上で props のドキュメンテーションが表示されなくなっていたので復活させる
What I did
コンポーネントの静的解析に
react-docgen
でなくreact-docgen-typescript
を使用するように明示するCapture